<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <script src="/layui/layui.js"></script>
    <title>业务列表</title>
</head>
<body>
<!--头部工具栏-->
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-xs" lay-event="add">添加业务</button>
        <button class="layui-btn layui-btn-xs layui-btn-normal" lay-event="exportExcel">导出为Excel</button>
        <button class="layui-btn layui-btn-xs layui-btn-normal" lay-event="exportCsv">导出为Csv</button>
    </div>
</script>

<!--行工具栏-->
<script type="text/html" id="ListDemo">
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="modelInsert">模板添加</a>
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="updateProgress">查看进度</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">修改</a>
</script>

<!--添加form表单-->
<form class="layui-form" action="" id="saveForm" style="display: none;margin-right: 40px;margin-top: 20px">
    <!--创建人-->
    <input type="hidden" th:value="${session.username}" name="createBy">
    <input type="hidden" name="uploadDtName" id="insertUploadDtName">
    <input type="hidden" name="noticeDtName" id="insertNoticeDtName">
    <input type="hidden" name="insertUpload" id="insertUpload">
    <input type="hidden" name="uploadSourceName" id="uploadSourceName">
    <div class="layui-form-item">
        <label class="layui-form-label">客户名</label>
        <div class="layui-input-inline">
            <input hidden name="customId" id="addCustomTableSelectHidden" th:value="${customId}">
            <input type="text" name="customName" id="addCustomTableSelect" readonly required
                   lay-verify="required" placeholder="请输入客户名" autocomplete="off"
                   class="layui-input">
        </div>
        <label class="layui-form-label">业务类型</label>
        <div class="layui-input-inline">
            <select id="topType" name="businessTopType">

            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">申请号</label>
        <div class="layui-input-block">
            <input type="text" name="applicantCode" placeholder="请输入申请号"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">业务名</label>
        <div class="layui-input-block">
            <input type="text" name="businessName" required lay-verify="required" placeholder="请输入业务名"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">商标类别</label>
        <div class="layui-input-block">
            <input type="text" name="trademarkType" readonly id="addTrademarkType" required lay-verify="required"
                   placeholder="请选择商标类别"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">业务种类</label>
        <div class="layui-input-block">
            <input type="text" name="businessSecondType" readonly id="addBusinessType" required lay-verify="required"
                   placeholder="请选择业务种类"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">
            <button type="button" class="layui-btn layui-btn-xs" id="insertAddUpload">上传文件</button>
        </label>
        <div class="layui-input-block">
            <input type="text" id="insertAddSourceName"
                   placeholder="" autocomplete="off" class="layui-input">
        </div>
    </div>
    <p id="insertAddText"></p>
    <div class="layui-form-item">
        <label class="layui-form-label">成交价格</label>
        <div class="layui-input-inline">
            <input type="number" name="price" required lay-verify="required" placeholder="请输入成交价格" autocomplete="off"
                   class="layui-input">
        </div>
        <label class="layui-form-label">代理费</label>
        <div class="layui-input-inline">
            <input type="number" name="proxyMoney" required lay-verify="required" placeholder="请输入代理费"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">申请时间</label>
        <div class="layui-input-inline">
            <input type="text" name="applicantTime" id="date"
                   autocomplete="off" class="layui-input">
        </div>
        <label class="layui-form-label">备注</label>
        <div class="layui-input-inline">
            <input type="text" name="remark" lay-verify="" placeholder="请输入备注" autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit id="addBussinessButton" lay-filter="saveFilter">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-normal">重置</button>
        </div>
    </div>
</form>

<!--编辑业务-->
<form class="layui-form" id="editForm" lay-filter="example" name="edit"
      style="display: none;margin-right: 40px;margin-top: 20px">
    <!--修改人-->
    <input type="hidden" th:value="${session.username}" name="updateBy">
    <input type="hidden" name="businessId">
    <!--修改文件隐藏input框-->
    <input type="hidden" name="progressId">
    <input type="hidden" name="uploadId">
    <input type="hidden" name="uploadDtName" id="updateUploadDtName">
    <input type="hidden" name="noticeDtName" id="updateNoticeDtName">
    <input type="hidden" name="uploadSourceName" id="updateUploadSourceName">

    <div class="layui-form-item">
        <label class="layui-form-label">客户名</label>
        <div class="layui-input-inline">
            <input hidden name="customId" id="updateCustomTableSelectHidden">
            <input type="text" name="customName" id="updateCustomTableSelect" readonly required
                   lay-verify="required" placeholder="请输入客户名" autocomplete="off"
                   class="layui-input">
        </div>
        <label class="layui-form-label">业务类型</label>
        <div class="layui-input-inline">
            <select id="updateTopType" name="businessTopType">

            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">申请号</label>
        <div class="layui-input-block">
            <input type="number" name="applicantCode" placeholder="请输入申请号"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">业务名</label>
        <div class="layui-input-block">
            <input type="text" name="businessName" required lay-verify="required" placeholder="请输入业务名"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">商标类别</label>
        <div class="layui-input-block">
            <input type="text" name="trademarkType" readonly required lay-verify="required" id="updateTrademarkType"
                   placeholder="请选择商标类别"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">业务种类</label>
        <div class="layui-input-block">
            <input type="text" name="businessSecondType" readonly id="updateBusinessType" required lay-verify="required"
                   placeholder="请选择业务种类"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">
            <button type="button" class="layui-btn layui-btn-xs" id="updateAddUpload">上传文件</button>
        </label>
        <div class="layui-input-block">
            <input type="text" id="updateAddSourceName"
                   placeholder="" autocomplete="off" class="layui-input">
        </div>
    </div>
    <p id="updateAddText"></p>
    <div class="layui-form-item">
        <label class="layui-form-label">成交价格</label>
        <div class="layui-input-inline">
            <input type="number" name="price" required lay-verify="required" placeholder="请输入成交价格" autocomplete="off"
                   class="layui-input">
        </div>
        <label class="layui-form-label">代理费</label>
        <div class="layui-input-inline">
            <input type="number" name="proxyMoney" required lay-verify="required" placeholder="请输入代理费"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">申请时间</label>
        <div class="layui-input-inline">
            <input type="text" name="applicantTime" id="date1" lay-verify="datetime" placeholder="yyyy-MM-dd HH:mm:ss"
                   autocomplete="off" class="layui-input">
        </div>
        <label class="layui-form-label">备注</label>
        <div class="layui-input-inline">
            <input type="text" name="remark" placeholder="请输入备注" autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="editFilter">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-normal">重置</button>
        </div>
    </div>

</form>

<!--模板添加-->
<form class="layui-form" id="modelInsert" lay-filter="modelInsert" name="modelInsert"
      style="display: none;margin-right: 40px;margin-top: 20px">

    <!--修改文件隐藏input框-->
    <input type="hidden" name="progressId">
    <input type="hidden" name="uploadId">
    <input type="hidden" name="uploadDtName" id="templateUploadDtName">
    <input type="hidden" name="noticeDtName" id="templateNoticeDtName">
    <input type="hidden" name="uploadSourceName" id="templateUploadSourceName">

    <div class="layui-form-item">
        <label class="layui-form-label">客户名</label>
        <div class="layui-input-inline">
            <input hidden name="customId" id="modelInsertCustomTableSelectHidden">
            <input type="text" name="customName" id="modelInsertCustomTableSelect" readonly required
                   lay-verify="required" placeholder="请输入客户名" autocomplete="off"
                   class="layui-input">
        </div>
        <label class="layui-form-label">业务类型</label>
        <div class="layui-input-inline">
            <select id="modelInsertTopType" name="businessTopType">
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">申请号</label>
        <div class="layui-input-block">
            <input type="number" name="applicantCode" placeholder="请输入申请号"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">业务名</label>
        <div class="layui-input-block">
            <input type="text" name="businessName" required lay-verify="required" placeholder="请输入业务名"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">商标类别</label>
        <div class="layui-input-block">
            <input type="text" name="trademarkType" readonly required lay-verify="required"
                   id="modelInsertTrademarkType"
                   placeholder="请选择商标类别"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">业务种类</label>
        <div class="layui-input-block">
            <input type="text" name="businessSecondType" readonly id="modelInsertBusinessType" required
                   lay-verify="required"
                   placeholder="请选择业务种类"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">
            <button type="button" class="layui-btn layui-btn-xs" id="templateAddUpload">上传文件</button>
        </label>
        <div class="layui-input-block">
            <input type="text" id="templateAddSourceName"
                   placeholder="" autocomplete="off" class="layui-input">
        </div>
    </div>
    <p id="templateAddText"></p>
    <div class="layui-form-item">
        <label class="layui-form-label">成交价格</label>
        <div class="layui-input-inline">
            <input type="number" name="price" required lay-verify="required" placeholder="请输入成交价格" autocomplete="off"
                   class="layui-input">
        </div>
        <label class="layui-form-label">代理费</label>
        <div class="layui-input-inline">
            <input type="number" name="proxyMoney" required lay-verify="required" placeholder="请输入代理费"
                   autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">申请时间</label>
        <div class="layui-input-inline">
            <input type="text" name="applicantTime" id="modelInsertdate" lay-verify="datetime"
                   placeholder="yyyy-MM-dd HH:mm:ss"
                   autocomplete="off" class="layui-input">
        </div>
        <label class="layui-form-label">备注</label>
        <div class="layui-input-inline">
            <input type="text" name="remark" placeholder="请输入备注" autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <!--创建人-->
    <input hidden th:value="${session.username}" name="createBy">
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="saveFilter">立即提交</button>
        </div>
    </div>

</form>

<!--条件查询搜索框-->
<form class="layui-form" id="query" action="" style="margin-top: 20px">
    <div>
        <div class="layui-inline">
            <label class="layui-form-label">客户姓名</label>
            <div class="layui-input-inline">
                <input type="text" name="customName" placeholder="请输入客户姓名" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">申请号</label>
            <div class="layui-input-inline">
                <input type="text" name="applicantCode" placeholder="请输入申请号" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">业务名</label>
            <div class="layui-input-inline">
                <input type="text" name="businessName" placeholder="请输入业务名" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">创建时间</label>
            <div class="layui-input-inline">
                <input type="text" name="startDate" id="startDate" placeholder="yyyy-MM-dd" autocomplete="off"
                       class="layui-input">
            </div>
            <span style="font-size: 18px;font-weight: bold;color: blue;">—</span>
            <div class="layui-input-inline">
                <input type="text" name="endDate" id="endDate" placeholder="yyyy-MM-dd" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
    </div>
    <div style="margin-top: 10px">
        <div class="layui-inline">
            <label class="layui-form-label">进度</label>
            <div class="layui-input-inline">
                <input type="text" name="status" placeholder="请输入进度" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">业务种类</label>
            <div class="layui-input-inline">
                <input type="text" name="businessSecondType" id="queryBusinessSecondType" placeholder="请输入业务种类" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">代理人</label>
            <div class="layui-input-inline">
                <input type="text" name="createBy" placeholder="请输入代理人" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">修改人</label>
            <div class="layui-input-inline">
                <input type="text" name="updateBy" placeholder="请输入修改人" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-inline" style="margin-left: 20px">
            <div class="layui-input-inline">
                <button class="layui-btn" lay-submit lay-filter="selectFormfilter">查询</button>
                <button type="reset" class="layui-btn layui-btn-normal" id="myButton">重置</button>
            </div>
        </div>
    </div>
</form>

<table id="customTable" lay-filter="customFilter"></table>
<div class="layui-col-md12">
    <div class="layui-card">
        <div class="layui-card-body">
            <table id="businessTable" lay-filter="test"></table>
        </div>
    </div>
</div>
</body>
<!--商标类别弹窗-->
<form class="layui-form" action="" id="trademarkTypeSelect"
      style="display: none;margin-right: 40px;margin-top: 20px">
    <div class="layui-form-item">
        <div class="layui-input-block" id="trademarkRadios">

        </div>
    </div>
</form>

<!--业务种类弹窗-->
<form class="layui-form" action="" id="businessSecondTypeSelect"
      style="display: none;margin-right: 40px;margin-top: 20px">
    <div class="layui-form-item">
        <div class="layui-input-block" id="businessSecondTypeRadios">

        </div>
    </div>
</form>
<script>
    //自定义layui组件的目录
    layui.config({
        base: '/layui/lay/modules/'
    }).extend({
        //设定组件别名
        tableSelect: 'tableSelect',
    });
    layui.use(['table', 'layer', 'jquery', 'laydate', 'form', 'tableSelect', 'upload'], function () {
        let table = layui.table;
        let layer = layui.layer;
        let $ = layui.jquery;
        let form = layui.form;
        let laydate = layui.laydate;
        let tableSelect = layui.tableSelect;
        let upload = layui.upload;
        laydate.render({
            elem: '#startDate'
        });
        laydate.render({
            elem: '#endDate'
        });

        //添加客户编号选择表格
        tableSelect.render({
            elem: '#addCustomTableSelect',	//定义输入框input对象 必填
            checkedKey: 'customId', //表格的唯一建值，非常重要，影响到选中状态 必填
            searchKey: 'contact',	//搜索输入框的name值 默认keyword
            searchPlaceholder: '联系人姓名搜索',	//搜索输入框的提示文字 默认关键词搜索
            table: {	//定义表格参数，与LAYUI的TABLE模块一致，只是无需再定义表格elem
                url: '/custom/queryAll',
                cols: [
                    [
                        {type: 'radio'}
                        , {field: 'customId', title: '客户ID', align: 'center', sort: true, width: 90}
                        , {field: 'contact', title: '联系人姓名', align: 'center', width: 120}
                        , {field: 'phone', title: '手机号', align: 'center', width: 140}
                    ]
                ]
            },
            done: function (elem, data) {
                //选择完后的回调，包含2个返回值 elem:返回之前input对象；data:表格返回的选中的数据 []
                //拿到data[]后 就按照业务需求做想做的事情啦~比如加个隐藏域放ID...
                elem.val(data.data[0].contact)
                $("#addCustomTableSelectHidden").val(data.data[0].customId)
            }
        })
        //修改客户编号选择表格
        tableSelect.render({
            elem: '#updateCustomTableSelect',	//定义输入框input对象 必填
            checkedKey: 'customId', //表格的唯一建值，非常重要，影响到选中状态 必填
            searchKey: 'contact',	//搜索输入框的name值 默认keyword
            searchPlaceholder: '联系人姓名搜索',	//搜索输入框的提示文字 默认关键词搜索
            table: {	//定义表格参数，与LAYUI的TABLE模块一致，只是无需再定义表格elem
                url: '/custom/queryAll',
                cols: [
                    [
                        {type: 'radio'}
                        , {field: 'customId', title: '客户ID', align: 'center', sort: true, width: 90}
                        , {field: 'contact', title: '联系人姓名', align: 'center', width: 120}
                        , {field: 'phone', title: '手机号', align: 'center', width: 140}
                    ]
                ]
            },
            done: function (elem, data) {
                //选择完后的回调，包含2个返回值 elem:返回之前input对象；data:表格返回的选中的数据 []
                //拿到data[]后 就按照业务需求做想做的事情啦~比如加个隐藏域放ID...
                elem.val(data.data[0].contact)
                $("#updateCustomTableSelectHidden").val(data.data[0].customId)
            }
        })
        //模板添加客户编号选择表格
        tableSelect.render({
            elem: '#modelInsertCustomTableSelect',	//定义输入框input对象 必填
            checkedKey: 'customId', //表格的唯一建值，非常重要，影响到选中状态 必填
            searchKey: 'contact',	//搜索输入框的name值 默认keyword
            searchPlaceholder: '联系人姓名搜索',	//搜索输入框的提示文字 默认关键词搜索
            table: {	//定义表格参数，与LAYUI的TABLE模块一致，只是无需再定义表格elem
                url: '/custom/queryAll',
                cols: [
                    [
                        {type: 'radio'}
                        , {field: 'customId', title: '客户ID', align: 'center', sort: true, width: 90}
                        , {field: 'contact', title: '联系人姓名', align: 'center', width: 120}
                        , {field: 'phone', title: '手机号', align: 'center', width: 140}
                    ]
                ]
            },
            done: function (elem, data) {
                //选择完后的回调，包含2个返回值 elem:返回之前input对象；data:表格返回的选中的数据 []
                //拿到data[]后 就按照业务需求做想做的事情啦~比如加个隐藏域放ID...
                elem.val(data.data[0].contact)
                $("#modelInsertCustomTableSelectHidden").val(data.data[0].customId)
            }
        })

        //日期
        laydate.render({
            elem: '#date1'
            , type: 'datetime'
        });


        let businessUrl = '/business/queryAll'
        let myTable = table.render({
            elem: '#businessTable'
            , id: 'businessTable'
            , url: businessUrl //数据接口
            , page: true //开启分页
            , toolbar: '#toolbarDemo'
            , totalRow: true //开启合计行
            , cols: [
                [ //表头
                    {type: 'checkbox', fixed: 'left'}
                    , {field: 'businessId', title: '业务ID', width: 100, sort: true, totalRowText: '合计:', fixed: 'left'}
                    , {field: 'customId', title: '客户ID', width: 100, hide: true}
                    , {
                    field: 'customName', title: '申请人', width: 100, templet: function (business) {
                        if (business.customName != null) {
                            return '<a href="/business/showCustomAndBusiness?customId=' + business.customId + '">' + business.customName + '</a>';
                        } else {
                            return "";
                        }
                    }
                }
                    , {field: 'applicantCode', title: '申请号', width: 160}
                    , {field: 'applicantTime', title: '申请时间', width: 160}
                    , {field: 'businessName', title: '业务名', width: 160}
                    , {field: 'trademarkType', title: '商标类别', width: 200}
                    , {
                    field: 'uploadId', title: '申请文件(点击下载)', width: 170,
                    templet: function (tb) {
                        if (tb.uploadId != null) {
                            return '<a href="' + tb.destinationName + '">' + tb.sourceName + '</a>';
                        } else {
                            return "";
                        }
                    }
                }
                    , {field: 'status', title: '进度', width: 120}
                    , {field: 'businessTopType', title: '业务类型', width: 100,}
                    , {field: 'businessSecondType', title: '业务种类', width: 160}
                    , {field: 'price', title: '成交价格', width: 100, totalRow: true}
                    , {field: 'proxyMoney', title: '代理费', width: 100, totalRow: true}
                    , {field: 'createBy', title: '代理人', width: 80}
                    , {field: 'createTime', title: '创建时间', width: 160}
                    , {field: 'updateBy', title: '修改人', width: 80}
                    , {field: 'updateTime', title: '修改时间', width: 160}
                    , {field: 'remark', title: '备注', width: 100}
                    , {fixed: 'right', align: 'center', title: '操作', width: 210, toolbar: '#ListDemo'}
                ]
            ]
        });
        //获取传过来的customId
        let customeId = "";
        customeId = [[${customId}]] + "";

        if (customeId == 0) {
            document.getElementById("customTable").hidden = true
        } else {
            document.getElementById("customTable").hidden = false
            let customUrl = '/custom/selectOne?id=' + customeId
            let customTable = table.render({
                elem: '#customTable'
                , url: '/custom/queryAll' //数据接口
                , page: false //开启分页
                , cols: [
                    [ //表头
                        {field: 'customId', title: '客户ID', align: 'center', sort: true, width: 90}
                        , {field: 'contact', title: '联系人姓名', align: 'center', width: 120}
                        , {field: 'phone', title: '手机号', align: 'center', width: 140}
                        , {field: 'applicant', title: '申请人', align: 'center', width: 120}
                        , {field: 'customAddress', title: '邮寄地址', align: 'center', width: 120}
                        , {field: 'createBy', title: '创建人', align: 'center', width: 120}
                        , {field: 'createTime', title: '创建时间', align: 'center', width: 160}
                        , {field: 'updateBy', title: '修改人', align: 'center', width: 120}
                        , {field: 'updateTime', title: '修改时间', align: 'center', width: 160}
                        , {field: 'proxyId', title: '代理人ID', align: 'center', width: 120, hide: true}
                        , {field: 'userName', title: '代理人', align: 'center', width: 120}
                        , {field: 'remark', title: '备注', align: 'center', width: 120}
                    ]
                ]
            });
            myTable.reload({
                where: { //设定异步数据接口的额外参数，任意设
                    customId:customeId+""
                }
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        }

        let $topType = $("#topType");
        let $updateTopType = $("#updateTopType");
        let $modelInsertTopType = $("#modelInsertTopType");
        let $trademarkRadios = $('#trademarkRadios')
        let $businessSecondTypeRadios = $('#businessSecondTypeRadios')
        let options = '';
        let trademarkRadios = '';
        let businessSecondTypeRadios = '';
        //填充下拉框
        $.ajax({
            url: "/business/findAllDictionary",
            type: "GET",
            dataType: "JSON",
            success: function (allDictionary) {
                let data = allDictionary.data;
                //将数据放到select中
                for (let i = 0; i < data.length; i++) {
                    if (data[i].type_id == 2) {
                        options += '<option value="' + data[i].dictionary_name + '">' + data[i].dictionary_name + '</option>';
                    }
                }
                //将数据放到商标类别选择框中
                for (let i = 0; i < data.length; i++) {
                    if (data[i].type_id == 1) {
                        trademarkRadios += '<button style="border: 0;background-color: white" lay-submit lay-filter="trademarkFilter"><input type="radio" lay-submit="" lay-filter="checkFilter" name="trademarkInput" title="' + data[i].dictionary_name + '" value="' + data[i].dictionary_name + '"/></button>';
                    }
                }
                //将数据放到业务种类选择框中
                for (let i = 0; i < data.length; i++) {
                    if (data[i].type_id == 3) {
                        businessSecondTypeRadios += '<button style="border: 0;background-color: white" lay-submit lay-filter="businessFilter"><input type="radio" name="businessInput" title="' + data[i].dictionary_name + '" value="' + data[i].dictionary_name + '"/></button>';
                    }
                }

                $businessSecondTypeRadios.html(businessSecondTypeRadios)
                $trademarkRadios.html(trademarkRadios)
                $topType.html(options)
                $updateTopType.html(options)
                $modelInsertTopType.html(options)
                form.render()
            }
        })
        //监听头工具栏事件
        table.on('toolbar(test)', function (obj) {
            let checkStatus = table.checkStatus(obj.config.id)
                , data = checkStatus.data; //获取选中的数据
            switch (obj.event) {
                case 'add':
                    $("#addBussinessButton").attr("class", "layui-btn")
                    document.getElementById("saveForm").reset()
                    //表单重置后设置初始时间
                    laydate.render({
                        elem: '#date'
                        , type: 'datetime'
                        , value: new Date()
                    });
                    layer.open({
                        title: '添加业务',
                        type: 1,
                        area: ['690px', '500px'],
                        content: $("#saveForm")//这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
                    });
                    break;
                case 'exportExcel':
                    if (data != "") {
                        table.exportFile('businessTable', data, 'xls');
                    } else {
                        layer.msg("请选择要导出的数据")
                    }
                    break;
                case 'exportCsv':
                    if (data != "") {
                        table.exportFile('businessTable', data);
                    } else {
                        layer.msg("请选择要导出的数据")
                    }
                    break;
            }
        });

        //监听行工具事件
        table.on('tool(test)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            let data = obj.data //获得当前行数据
                , layEvent = obj.event; //获得 lay-event 对应的值
            if (layEvent === 'updateProgress') {
                //跳转到进度页面
                location.href = "/progress/showBusinessAndProgress?customId=" + data.customId + "&businessId=" + data.businessId
            } else if (layEvent === 'modelInsert') {
                document.getElementById("modelInsert").reset()

                form.val('modelInsert', {
                    "businessId": data.businessId
                    , "customName": data.customName
                    , "applicantCode": data.applicantCode// "name": "value"
                    , "applicantTime": data.applicantTime
                    , "businessTopType": data.businessTopType
                    , "trademarkType": data.trademarkType
                    , "price": data.price
                    , "proxyMoney": data.proxyMoney
                    , "uploadId": data.uploadId
                    , "customId": data.customId
                    , "remark": data.remark
                    , "businessName": data.businessName
                    , "businessSecondType": data.businessSecondType
                });
                layer.open({
                    title: '模板添加',
                    type: 1,
                    area: ['690px', '500px'],

                    content: $("#modelInsert"),//这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响

                });

            } else if (layEvent === 'edit') {
                form.val('example', data);
                layer.open({
                    title: '修改业务',
                    type: 1,
                    area: ['690px', '500px'],

                    content: $("#editForm"),//这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响

                });
            }
        });

        //添加表单
        form.on('submit(saveFilter)', function (data) {
            if (document.getElementById("addBussinessButton").className != "layui-btn layui-btn-disabled") {
                //提交表单数据
                $.ajax({
                    url: "/business/insert",
                    type: "POST",
                    dataType: "JSON",
                    data: data.field,
                    success: function (ret) {
                        if (ret.code == 0) {
                            //关闭对话框
                            layer.closeAll();
                            //刷新表格数据
                            myTable.reload({
                                page: {
                                    curr: 1 //重新从第 1 页开始
                                }
                            });
                            layer.msg(ret.msg, {icon: 6});
                        } else {
                            layer.msg(ret.msg, {icon: 5});
                        }

                    }
                })
                $("#addBussinessButton").attr("class", "layui-btn layui-btn-disabled")
                return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。

            } else {
                return false;
            }
        });

        //编辑表单
        form.on('submit(editFilter)', function (data) {
            console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
            //提交表单数据
            $.ajax({
                url: "/business/update",
                type: "POST",
                dataType: "JSON",
                data: data.field,
                success: function (ret) {
                    if (ret.code == 0) {
                        //关闭对话框
                        layer.closeAll();
                        //刷新表格数据
                        myTable.reload({
                            page: {
                                curr: 1 //重新从第 1 页开始
                            }
                        });
                        layer.msg(ret.msg, {icon: 6});
                    } else {
                        layer.msg(ret.msg, {icon: 5});
                    }

                }
            })
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        //查询表单
        form.on('submit(selectFormfilter)', function (data) {
            console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
            myTable.reload({
                where: { //设定异步数据接口的额外参数，任意设
                    customName: data.field.customName
                    , applicantCode: data.field.applicantCode
                    , businessName: data.field.businessName
                    , startDate: data.field.startDate
                    , endDate: data.field.endDate
                    , status: data.field.status
                    , businessSecondType: data.field.businessSecondType
                    , createBy: data.field.createBy
                    , updateBy: data.field.updateBy
                }
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        //重置条件查询表单，刷新table数据
        $("#myButton").click(function () {
            myTable.reload({
                where: { //设定异步数据接口的额外参数，任意设
                    businessName: ""
                    , createBy: ""
                    , applicantCode: ""
                    , customName: ""
                    , startDate: ""
                    , endDate: ""
                    , status: ""
                    , businessSecondType: ""
                    , updateBy: ""
                }
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        })

        //商标弹窗
        let trademarkTypeOpen;
        //业务种类弹窗
        let businessSecondTypeOpen;

        //点击弹出选择商标类别框
        $("input[name=trademarkType]").click(function () {
            trademarkTypeOpen = layer.open({
                title: '选择商标类别',
                type: 1,
                content: $('#trademarkTypeSelect'),
                area: ['650px', '600px']
            });
        })

        //点击弹出选择业务种类框
        $("input[name=businessSecondType][id!=queryBusinessSecondType]").click(function () {
            businessSecondTypeOpen = layer.open({
                title: '选择业务种类',
                type: 1,
                content: $('#businessSecondTypeSelect'),
                area: ['670px', '600px']
            });
        })

        //选择好商标类别，关闭弹窗
        form.on('submit(trademarkFilter)', function (data) {
            layer.close(trademarkTypeOpen)
            $("#addTrademarkType").val(data.field.trademarkInput);
            $("#updateTrademarkType").val(data.field.trademarkInput);
            $("#modelInsertTrademarkType").val(data.field.trademarkInput);
            return false;
        })

        //选择好业务种类，关闭弹窗
        form.on('submit(businessFilter)', function (data) {
            layer.close(businessSecondTypeOpen)
            $("#addBusinessType").val(data.field.businessInput);
            $("#updateBusinessType").val(data.field.businessInput);
            $("#modelInsertBusinessType").val(data.field.businessInput);
            return false;
        });

        //增加的文件上传
        let insertAddUpload = upload.render({
            elem: '#insertAddUpload'
            , url: '/upload/updateFile' //上传接口
            , accept: 'file' //普通文件
            , done: function (res) {
                if(res.code==0){
                    //给隐藏的input框赋值，传入后台
                    $("#insertUploadDtName").val(res.data.filePath);
                    $("#insertUpload").val(res.data.fileName)
                    $("#uploadSourceName").val(res.data.fileName)
                    //回显原文件名
                    $("#insertAddSourceName").val(res.data.fileName);
                    layer.msg('上传成功');
                }else {
                    return layer.msg('上传失败')
                }
            }
            , error: function () {
                //演示失败状态，并实现重传
                let insertAddText = $('#insertAddText');
                insertAddText.html('<span style="color: #ff5722;">上传失败</span> <a class="layui-btn layui-btn-xs uploadReload">重试</a>');
                insertAddText.find('.uploadReload').on('click', function () {
                    insertAddUpload.upload();
                });
            }
        });

        //编辑的文件上传
        let updateAddUpload = upload.render({
            elem: '#updateAddUpload'
            , url: '/upload/updateFile' //上传接口
            , accept: 'file' //普通文件
            , done: function (res) {
                if(res.code==0){
                    //给隐藏的input框赋值，传入后台
                    $("#updateUploadDtName").val(res.data.filePath);
                    $("#updateUploadSourceName").val(res.data.fileName)
                    //回显原文件名
                    $("#updateAddSourceName").val(res.data.fileName);
                    layer.msg('上传成功');
                }else {
                    return layer.msg('上传失败')
                }
            }
            , error: function () {
                //演示失败状态，并实现重传
                let updateAddText = $('#updateAddText');
                updateAddText.html('<span style="color: #ff5722;">上传失败</span> <a class="layui-btn layui-btn-xs uploadReload">重试</a>');
                updateAddText.find('.uploadReload').on('click', function () {
                    updateAddUpload.upload();
                });
            }
        });

        //模板添加的文件上传
        let templateAddUpload = upload.render({
            elem: '#templateAddUpload'
            , url: '/upload/updateFile' //上传接口
            , accept: 'file' //普通文件
            , done: function (res) {
                if(res.code==0){
                    //给隐藏的input框赋值，传入后台
                    $("#templateUploadDtName").val(res.data.filePath);
                    $("#templateUploadSourceName").val(res.data.fileName)
                    //回显原文件名
                    $("#templateAddSourceName").val(res.data.fileName);
                    layer.msg('上传成功');
                }else {
                    return layer.msg('上传失败')
                }
            }
            , error: function () {
                //演示失败状态，并实现重传
                let templateAddText = $('#templateAddText');
                templateAddText.html('<span style="color: #ff5722;">上传失败</span> <a class="layui-btn layui-btn-xs uploadReload">重试</a>');
                templateAddText.find('.uploadReload').on('click', function () {
                    templateAddUpload.upload();
                });
            }
        });
    });
</script>

</html>